package com.example.k251014

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.safeContentPadding
import androidx.compose.foundation.layout.size
import androidx.compose.material3.Button
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import org.jetbrains.compose.ui.tooling.preview.Preview

import kotlinx.datetime.LocalTime
import kotlinx.datetime.TimeZone
import kotlinx.datetime.toLocalDateTime
import kotlin.time.Clock
import kotlin.time.ExperimentalTime

import androidx.compose.material3.DropdownMenu
import androidx.compose.material3.DropdownMenuItem
import k251014.composeapp.generated.resources.Res
import org.jetbrains.compose.resources.DrawableResource
import org.jetbrains.compose.resources.painterResource

import k251014.composeapp.generated.resources.jp
import k251014.composeapp.generated.resources.eg
import k251014.composeapp.generated.resources.fr
import k251014.composeapp.generated.resources.id
import k251014.composeapp.generated.resources.mx

//

//@Composable
//@Preview
//fun App() {
//    MaterialTheme {
//        var showContent by remember { mutableStateOf(false) }
//        Column(
//            modifier = Modifier
//                .background(MaterialTheme.colorScheme.primaryContainer)
//                .safeContentPadding()
//                .fillMaxSize(),
//            horizontalAlignment = Alignment.CenterHorizontally,
//        ) {
//            Text(
//                "Today's date is ${todaysDate()}",
//                modifier = Modifier.padding(20.dp),
//                fontSize = 24.sp,
//                textAlign = TextAlign.Center
//            )
//            Button(onClick = { showContent = !showContent }) {
//                Text("Click me!")
//            }
//            AnimatedVisibility(showContent) {
//                val greeting = remember { Greeting().greet() }
//                Column(
//                    modifier = Modifier.fillMaxWidth(),
//                    horizontalAlignment = Alignment.CenterHorizontally,
//                ) {
//                    Image(painterResource(Res.drawable.compose_multiplatform), null)
//                    Text("Compose: $greeting")
//                }
//            }
//        }
//    }
//}
//
//
//@OptIn(ExperimentalTime::class)
//fun todaysDate(): String {
//    fun LocalDateTime.format() = toString().substringBefore('T')
//
//    val now = Clock.System.now()
//    val zone = TimeZone.currentSystemDefault()
//    return now.toLocalDateTime(zone).format()
//}


//@Composable
//@Preview
//fun App() {
//    MaterialTheme {
//        var timeAtLocation by remember { mutableStateOf("No location selected") }
//
//        Column(
//            modifier = Modifier
//                .safeContentPadding()
//                .fillMaxSize(),
//        ) {
//            Text(timeAtLocation)
//            Button(onClick = { timeAtLocation = "13:30" }) {
//                Text("Show Time At Location")
//            }
//        }
//    }
//}


data class Country(val name : String, val zone : TimeZone, val image : DrawableResource)


@OptIn(ExperimentalTime::class)
fun currentTimeAt(location : String, zone : TimeZone) : String {
    // 相当于给 LocalTime 添加一个成员函数 formatted()
    fun LocalTime.formatted() = "$hour:$minute:$second"

    val time = Clock.System.now()
    val localTime = time.toLocalDateTime(zone).time

    return "The time in $location is ${localTime.formatted()}"
}

fun countries() = listOf(
    Country("Japan", TimeZone.of("Asia/Tokyo"), Res.drawable.jp),
    Country("France", TimeZone.of("Europe/Paris"), Res.drawable.fr),
    Country("Mexico", TimeZone.of("America/Mexico_City"), Res.drawable.mx),
    Country("Indonesia", TimeZone.of("Asia/Jakarta"), Res.drawable.id),
    Country("Egypt", TimeZone.of("Africa/Cairo"), Res.drawable.eg)
)

@Composable // 并不是宏，而是注解，标记当前函数为组合函数
@Preview
fun App() {
    MaterialTheme {
//        var location by remember { mutableStateOf("Europe/Paris") }
        var showCountries by remember { mutableStateOf(false) }
        var timeAtLocation by remember { mutableStateOf("No location selected") }

        Column (
            modifier = Modifier
                .padding(20.dp)
                .safeContentPadding()
                .fillMaxSize()
        )
        {
            Text(
                timeAtLocation,
                style = TextStyle(fontSize = 20.sp),
                textAlign = TextAlign.Center,
                modifier = Modifier.fillMaxWidth().align(Alignment.CenterHorizontally)
            )
//            TextField(
//                value = location,
//                onValueChange = { location = it },
//                modifier = Modifier.padding(top = 10.dp)
//            )

            Row(
                modifier = Modifier.padding(start = 20.dp, top = 20.dp)
            )
            {
                DropdownMenu(
                    expanded = showCountries,
                    onDismissRequest = { showCountries = false }
                )
                {
                    countries().forEach { (name, zone, image) ->
                        DropdownMenuItem(
                            text = { Row(verticalAlignment = Alignment.CenterVertically) {
                                    Image(
                                        painterResource(image),
                                        modifier = Modifier.size(50.dp).padding(end = 10.dp),
                                        contentDescription = "$name flag"
                                    )
                                    Text(name)
                                }
                            },
                            onClick = { // lambda 表达式？？
                                timeAtLocation = currentTimeAt(name, zone)
                                showCountries = false
                            }
                        )
                    }
                }

            }

            Button(
                modifier = Modifier.padding(top = 10.dp),
                onClick = { showCountries = !showCountries }
            ) {
                Text("Show Time")
            }
        }
    }
}
